<!DOCTYPE html>
<!--
 testAjax(){
     axios({
         url:"",
         method:"",
         param:"",// 不管使用的请求方式是post还是get，请求参数都会被拼接到请求地址的后面
         // 此种方式的请求参数可以通过request.getParameter()获取
         dara:"", // 以json格式发送请求参数，请求参数会被保存到请求报文的请求体传输到服务器
     }).then(function (resp) {
         console.log(resp.data)
     })
 }
-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
</head>
<body>
<div  id="app">
    <h1>index.html</h1>
    <input type="button" value="测试springMVC处理ajax" @click="testAjax()"><br>
    <input type="button" value="测试使用@RequestBody注解处理json格式的请求参数" @click="testRequestBody()"><br>
    <a th:href="@{/test/ResponseBody}">测试@ResponseBody注解响应浏览器数据</a><br>
    <input type="button" value="使用@ResponseBody注解响应json格式数据" @click="testResponseBody()"><br>
    <a th:href="@{test/down}">下载图片</a><br>
    <!--上传只能是post-->
    <form th:action="@{test/up}" method="post" enctype="multipart/form-data">
        头像：
        <input type="file" name="photo"><br>
        <input type="submit" value="上传">
    </form>
</div>
<script type="text/javascript" th:src="@{/js/vue.js}"></script>
<script type="text/javascript" th:src="@{/js/axios.min.js}"></script>
<script type="text/javascript">
    var vue = new Vue({
        el:"#app",
        methods:{
            testAjax(){
                axios.post(
                    "/spring_mvc_ajax_war_exploded/test/ajax?id=1001",
                    {
                        username:"admin",
                        password:"123456"
                    }
            ).then(function (resp){
                console.log(resp.data)
                })
            },
            testRequestBody(){
                axios.post(
                    "/spring_mvc_ajax_war_exploded/test/RequestBody/json",
                    {
                        username:"admin",
                        password:"123456",
                        age:23,
                        gender: "男"
                    }
                ).then(function (resp){
                    console.log(resp.data)
                })
            },
            testResponseBody(){
                axios.post(
                    "/spring_mvc_ajax_war_exploded/test/ResponseBody/json"
                ).then(function (resp) {
                    console.log(resp)
                })
            }
        }
    })
</script>
</body>
</html>